<%@ page contentType="text/html;charset=UTF-8" isErrorPage="true" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <title>寻找城市代言“家”</title>
    <link rel="stylesheet" href="${ctx}/static/css/animate.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/css/preliminaries.css"/>
</head>
<body>
<!-------------------------加载------------------------------------------>
 <!--背景音乐 -->
<audio id="audio" src="http://huar.oss-cn-shenzhen.aliyuncs.com/bg.mp3" controls="controls" loop="false" hidden="true" autoplay="autoplay">
            您的浏览器不支持 audio 标签。
</audio>
<!-----------------------main1--------------------------------------------->
<div id="main">
    <div class="content">
        <!---------------content_1--------------------------------------------->
        <div class="content_1">
            <img src="${ctx}/static/image/logo2.png" class="logo2"/>
            <img src="${ctx}/static/image/slogan2.png" class="slogan2"/>
            <div class="figure">
                <img src="${ctx}/static/image/propaganda.png" class="propaganda"/>
                <img src="${ctx}/static/image/figure1.png" class="figure1"/>
                <img src="${ctx}/static/image/figure2.png" class="figure2"/>
                <div class="circlebox">
	                <img src="${ctx}/static/image/circle1.png" class="circle1"/>
	                <img src="${ctx}/static/image/circle2.png" class="circle2"/>
	                <img src="${ctx}/static/image/circle3.png" class="circle3"/>
                </div>
                <a href="${ctx}/userInfo/preliminaries2" class="TR_btn"><img src="${ctx}/static/image/theRegistration.png" class="theRegistration"/></a>
                <a href="${ctx}/userInfo/preliminaries10/desc_1" class="IV_btn"><img src="${ctx}/static/image/iVote.png" class="iVote"/></a>
                <div class="Clear"></div>
            </div>
        </div>
    </div>
    <!----------------------------底部菜单----------------------------------->
    <div class="nav">
        <a href="${ctx}/userInfo/preliminaries2"><img src="${ctx}/static/image/registration.png"/><br/>报名</a>
        <a href="${ctx}/userInfo/preliminaries10/desc_1"><img src="${ctx}/static/image/vote.png"/><br/>投票</a>
        <a href="${ctx}/userInfo/preliminaries8"><img src="${ctx}/static/image/activity.png"/><br/>活动说明</a>
        <a href="${ctx}/userInfo/preliminaries7"><img src="${ctx}/static/image/prize.png" style="width: 20%"/><br/>我的奖品</a>
        <img src="${ctx}/static/image/line.png" class="line1"/>
        <img src="${ctx}/static/image/line.png" class="line2"/>
        <img src="${ctx}/static/image/line.png" class="line3"/>
    </div>
</div>
<script src="${ctx}/static/js/jquery-1.8.0.min.js"></script>
<script src="${ctx}/static/js/filereader.js"></script>
<script src="${ctx}/static/js/preliminaries.js"></script>


<!-- 对接微信 JS Api -->
<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	console.log(location.href.split('#')[0]);
	var thisPageUrl = location.href.split('#')[0];
	
	$.ajax({ url: "${ctx}/jsapi/ajax/sign", 
		 type: "POST",
		 data:{url:""+thisPageUrl},
		 dataType: "json",
		 //sync: true,
		 cache: false,//解决三星手机，缓存后不提交请求
		 success: function(data){
			 console.log(data);
			if(data.success){
				configWeiXin(data.appId,data.timestamp,data.nonceStr,data.signature);
				//regiestWxJsApi();
			}else{
				console.log("配置weixin jsapi失败");
			}
			
		 },
	  	 error: function(XMLHttpRequest, textStatus, errorThrown){
	      	console.log(XMLHttpRequest.responseText);
		 }
	});
});



  /*
   * 注意：
   * 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
   * 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
   * 3. 常见问题及完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
   *
   * 开发中遇到问题详见文档“附录5-常见错误及解决办法”解决，如仍未能解决可通过以下渠道反馈：
   * 邮箱地址：weixin-open@qq.com
   * 邮件主题：【微信JS-SDK反馈】具体问题
   * 邮件内容说明：用简明的语言描述问题所在，并交代清楚遇到该问题的场景，可附上截屏图片，微信团队会尽快处理你的反馈。
   */
function configWeiXin(appId, timestamp, nonceStr, signature){
	   wx.config({
	      debug: false,// 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
	      appId: appId,
	      timestamp: timestamp,
	      nonceStr: nonceStr,
	      signature: signature,
	      jsApiList: [
	        'onMenuShareTimeline',
	        'onMenuShareAppMessage',
	        'onMenuShareQQ',
	        'onMenuShareWeibo'
	      ]
	  });
   }
   
wx.ready(function(){
	var myLink= "http://huarunapp.cn-hangzhou.aliapp.com";
	var myTitle="寻找城市代言“家”";
   	var myDesc="寻找城市代言“家”，参与即送50元油卡，晋级还有5000元旅游基金";
   	var myImageUrl="${headimgurl}";
    // 1 监听“分享给朋友”，按钮点击、自定义分享内容及分享结果接口
    wx.onMenuShareAppMessage({
		title: myTitle,
		desc: myDesc,
		link: myLink,
		imgUrl: myImageUrl,
		type:'link',
		dataUrl:'',
		trigger: function (res) {
		  // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回
		  //alert('用户点击发送给朋友');
		 // alert(myLink);
		},
		success: function (res) {
		  //alert('已分享');
		},
		cancel: function (res) {
		  //alert('已取消');
		},
		fail: function (res) {
		  //alert(JSON.stringify(res));
		}
    });
    
 	// 2 监听“分享到朋友圈”按钮点击、自定义分享内容及分享结果接口
	wx.onMenuShareTimeline({
		title: myTitle,
	    link: myLink,
	    imgUrl: myImageUrl,
	    trigger: function (res) {
	      // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回
	      //alert('用户点击发送给朋友');
	    	//alert(myLink);
	    },
	    success: function (res) {
	      //alert('已分享');
	    },
	    cancel: function (res) {
	      //alert('已取消');
	    },
	    fail: function (res) {
	      //alert(JSON.stringify(res));
	    	alert("分享失败，请重新尝试！");
	    }
	  });
	
	// 3 监听“分享到QQ”按钮点击、自定义分享内容及分享结果接口
	wx.onMenuShareQQ({
		title: myTitle,
	    desc: myDesc,
	    link: myLink,
	    imgUrl: myImageUrl,
	    trigger: function (res) {
	      // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回
	      //alert('用户点击发送给朋友');
	    },
	    success: function (res) {
	      //alert('已分享');
	    },
	    cancel: function (res) {
	      //alert('已取消');
	    },
	    fail: function (res) {
	      //alert(JSON.stringify(res));
	    	alert("分享失败，请重新尝试！");
	    }
	  });
	// 2.4 监听“分享到微博”按钮点击、自定义分享内容及分享结果接口
	wx.onMenuShareWeibo({
		title: myTitle,
	    desc: myDesc,
	    link: myLink,
	    imgUrl: myImageUrl,
	    trigger: function (res) {
	      // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回
	      //alert('用户点击发送给朋友');
	    },
	    success: function (res) {
	      //alert('已分享');
	    },
	    cancel: function (res) {
	      //alert('已取消');
	    },
	    fail: function (res) {
	      //alert(JSON.stringify(res));
	    	alert("分享失败，请重新尝试！");
	    }
	  });
    // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
});
wx.error(function(res){
	alert(res);
});
</script>

</body>
</html>

